<template>
	<view class="rule-wraper">
		<view class="buy-rules">
			<view class="" style="font-size: 35rpx;margin-bottom: 20rpx;padding-left: 20rpx;">
				购买规则
			</view>
			<uni-steps style="color:#fa8181;font-size: 20rpx;" :options="options"></uni-steps>
			<view class="" style="margin-top: 40rpx;padding-left: 20rpx;">*T日为交易日，周末和法定节假日不属于T日。若在节假日或15点后购买，将于下一个T日生效，确认份额等时间点都将顺延一个T日</view>
			<view class="table">
				<view class="table-head-l">金额(元)</view>
				<view class="table-head-r">费用</view>
				<view class="td-l">0 ≤ 金额 ＜ 100万</view>
				<view class="td-r">
					<text class="sm">1.5%</text>
					<text>0.6%</text>
				</view>
				<view class="td-l">100万 ≤ 金额 ＜ 200万</view>
				<view class="td-r">
					<text class="sm">1%</text>
					<text>0.6%</text>
				</view>
				<view class="td-l">
					200万 ≤ 金额 是＜ 500万
				</view>
				<view class="td-r">
					<text class="sm">0.3%</text>
					<text>0.3%</text>
				</view>
				<view class="td-l">金额 > 500万</view>
				<view class="td-r">
					<text class="sm">1000元</text>
					<text>1000元</text>
				</view>
				
			</view>
		</view>
		<view class="buy-rules">
			<view class="" style="font-size: 35rpx;margin-bottom: 20rpx;">
				赎回规则
			</view>
			<uni-steps style="color:#fa8181" :options="options"></uni-steps>
			<view class="" style="margin-top: 40rpx;">*T日为交易日，周末和法定节假日不属于T日。若在节假日或15点后购买，将于下一个T日生效，确认份额等时间点都将顺延一个T日</view>
			<view class="table">
				<view class="table-head-l">持有时间</view>
				<view class="table-head-r">费用</view>
				<view class="td-l">7天 ≤ 持有期限 ＜ 365天</view>
				<view class="td-r">
					
					<text>0.50%</text>
				</view>
				<view class="td-l">1年 ≤ 持有期限 ＜ 2年</view>
				<view class="td-r">
					
					<text>0.25%</text>
				</view>
				<view class="td-l">
					持有期限 ≥ 2年
				</view>
				<view class="td-r">
					
					<text>0.00%</text>
				</view>
				<view class="td-l">0天 ≤ 持有期限 ＜ 7天</view>
				<view class="td-r">
					
					<text>1.50%</text>
				</view>
				
			</view>
		</view>
		<view class="buy-rules">
			<view class="" style="font-size: 35rpx;margin-bottom: 20rpx;">
				运作费用
			</view>
			<view class="table">
				
				<view class="td-l">管理费</view>
				<view class="td-r">
					
					<text>1.50%</text>
				</view>
				<view class="td-l">托管费</view>
				<view class="td-r">
					
					<text>0.25%</text>
				</view>
				<view class="td-l">
					销售服务费
				</view>
				<view class="td-r">
					
					<text>--</text>
				</view>
				
				
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"Rules",
		data() {
			return {
				options:[
					{title:"T日15点前",desc:"购买"},
					{title:"T+1日17点后",desc:"确认份额"},
					{title:"T+2日",desc:"查看收益"},
					{title:"T+2日后",desc:"可赎回"},
					],
				options2:[
					{title:"T日15点前",desc:"赎回"},
					{title:"T+1日17点后",desc:"确认份额及到账金额"},
					{title:"T+2日",desc:"24点前到账"}
					
					]	
			};
		}
	}
</script>

<style lang="scss">
.step{
	/* height: 50rpx; */
	color: #fa8181;
}
.rule-wraper{
	// padding: 0 24rpx;
	color:gray;
}
.buy-rules{
	background-color: white;
	padding: 24rpx 0;
	margin: 20rpx 0;
}
.table{
	width: 700rpx;
	display: flex;
	flex-wrap: wrap;
	text-align: center;
	line-height: 100rpx;
	font-size: 35rpx;
	margin-top: 40rpx;
	.td-l, .table-head-l{
		width: 401rpx;
		height: 100rpx;
		border: 1rpx solid #f7f7f7;
	}
	.td-r, .table-head-r{
		width: 300rpx;
		height: 100rpx;
		border: 1rpx solid #f7f7f7;
	}
	.table-head-l, .table-head-r{
		background-color: #eaf1fe;
		color: #000;
		
	}
	.sm{
		font-size: 23rpx;
		text-decoration: line-through;
	}
}
</style>
